<?php
    require_once "common.php";
?>
<!DOCTYPE html>
<html>
	<head>
		<script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
		<meta name="viewport" content="width=320,user-scalable=no" />
    	<meta charset="utf-8" />
		<title>苏灬尘</title>
		<style type="text/css">
			*{margin:0;padding:0;}
			html,body{-webkit-perspective:2000px;perspective:2000px;-webkit-perspective-origin:top;perspective-origin:top; -moz-perspective:1200px;-ms-perspective:1200px;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;-moz-transform-style:preserve-3d;-ms-transform-style:preserve-3d;background:#f0c560;overflow:hidden;height:100%;}
			.main{-webkit-transform:translateZ(200px);}
			.div1{width:320px;height:714px;position:relative;margin:-150px auto 0;-webkit-perspective:1200px;perspective:1200px;-moz-perspective:1200px;-ms-perspective:1200px;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;-moz-transform-style:preserve-3d;-ms-transform-style:preserve-3d;}/*1273*/
			li{width:320px;height:714px;float:left;list-style:none;position:absolute;-webkit-transform:translateZ(127px);transform:translateZ(127px);-moz-transform:translateZ(127px);-ms-transform:translateZ(127px);-webkit-perspective:0;perspective:0;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;}
			.box{width:51px;height:100%; overflow:hidden;background:url(img/timg.png) no-repeat 0 0;overflow:hidden;background-color:#f0f0f0;position:absolute;right:0;top:0;bottom:0;-webkit-transform:rotateY(81deg);-moz-transform:rotateY(81deg);-ms-transform:rotateY(81deg);transform:rotateY(81deg);-webkit-transform-origin:right center;transform-origin:right center;-moz-transform-origin:right center;-ms-transform-origin:right center;}
			#click{width:100%;height:100%;z-index:999;position:absolute;left:0;top:0;bottom:0;right:0;}
		</style>
	</head>
	<body>
		<div id="click" onclick="window.location.href='index2.php'"></div>
		<div class="main">
			<div class="div1" style="">
				<ul>
					<li><div class="box"></div></li>
					<li><div class="box"></div></li>
					<li><div class="box"></div></li>
					<li><div class="box"></div></li>
					<li><div class="box"></div></li>
					<li><div class="box"></div></li>
					<li><div class="box"></div></li>
					<li><div class="box"></div></li>
					<li><div class="box"></div></li>
					<li><div class="box"></div></li>
					<li><div class="box"></div></li>
					<li><div class="box"></div></li>
					<li><div class="box"></div></li>
					<li><div class="box"></div></li>
					<li><div class="box"></div></li>
					<li><div class="box"></div></li>
					<li><div class="box"></div></li>
					<li><div class="box"></div></li>
					<li><div class="box"></div></li>
					<li><div class="box"></div></li>
				</ul>
			</div>
		</div>
	</body>
</html>
<script type="text/javascript">
	$(function(){
		for(var i=0;i<$("li").length;i++){
			$("li").eq(i).css({"-webkit-transform":"rotateY("+i*18+"deg)","transform":"rotateY("+i*18+"deg)","-moz-transform":"rotateY("+i*18+"deg)","-ms-transform":"rotateY("+i*18+"deg)"});
			$("li").eq(i).find(".box").css({"background-position":-i*32+"px 0"});
		}
		
		var r = 0;
		var iop = 0;
		var tu = true;
		setInterval(function(){
			iop+=0.5;
			if(iop>=360){
				iop=0
			}
			if(tu){
				if(iop<=18){
					$("li").find(".box").show();
					$("li").eq(11).find(".box").hide();
					$("li").eq(12).find(".box").hide();
					$("li").eq(13).find(".box").hide();
					$("li").eq(14).find(".box").hide();
					$("li").eq(15).find(".box").hide();
					$("li").eq(16).find(".box").hide();
					$("li").eq(17).find(".box").hide();
					$("li").eq(18).find(".box").hide();
					$("li").eq(19).find(".box").hide();
				}else if(iop>18 && iop<=36){
					$("li").find(".box").show();
					$("li").eq(10).find(".box").hide();
					$("li").eq(11).find(".box").hide();
					$("li").eq(12).find(".box").hide();
					$("li").eq(13).find(".box").hide();
					$("li").eq(14).find(".box").hide();
					$("li").eq(15).find(".box").hide();
					$("li").eq(16).find(".box").hide();
					$("li").eq(17).find(".box").hide();
					$("li").eq(18).find(".box").hide();
				}else if(iop>36 && iop<=54){
					$("li").find(".box").show();
					$("li").eq(9).find(".box").hide();
					$("li").eq(10).find(".box").hide();
					$("li").eq(11).find(".box").hide();
					$("li").eq(12).find(".box").hide();
					$("li").eq(13).find(".box").hide();
					$("li").eq(14).find(".box").hide();
					$("li").eq(15).find(".box").hide();
					$("li").eq(16).find(".box").hide();
					$("li").eq(17).find(".box").hide();
				}else if(iop>54 && iop<=72){
					$("li").find(".box").show();
					$("li").eq(8).find(".box").hide();
					$("li").eq(9).find(".box").hide();
					$("li").eq(10).find(".box").hide();
					$("li").eq(11).find(".box").hide();
					$("li").eq(12).find(".box").hide();
					$("li").eq(13).find(".box").hide();
					$("li").eq(14).find(".box").hide();
					$("li").eq(15).find(".box").hide();
					$("li").eq(16).find(".box").hide();
				}else if(iop>72 && iop<=90){
					$("li").find(".box").show();
					$("li").eq(7).find(".box").hide();
					$("li").eq(8).find(".box").hide();
					$("li").eq(9).find(".box").hide();
					$("li").eq(10).find(".box").hide();
					$("li").eq(11).find(".box").hide();
					$("li").eq(12).find(".box").hide();
					$("li").eq(13).find(".box").hide();
					$("li").eq(14).find(".box").hide();
					$("li").eq(15).find(".box").hide();
				}else if(iop>90 && iop<=108){
					$("li").find(".box").show();
					$("li").eq(6).find(".box").hide();
					$("li").eq(7).find(".box").hide();
					$("li").eq(8).find(".box").hide();
					$("li").eq(9).find(".box").hide();
					$("li").eq(10).find(".box").hide();
					$("li").eq(11).find(".box").hide();
					$("li").eq(12).find(".box").hide();
					$("li").eq(13).find(".box").hide();
					$("li").eq(14).find(".box").hide();
				}else if(iop>108 && iop<=126){
					$("li").find(".box").show();
					$("li").eq(5).find(".box").hide();
					$("li").eq(6).find(".box").hide();
					$("li").eq(7).find(".box").hide();
					$("li").eq(8).find(".box").hide();
					$("li").eq(9).find(".box").hide();
					$("li").eq(10).find(".box").hide();
					$("li").eq(11).find(".box").hide();
					$("li").eq(12).find(".box").hide();
					$("li").eq(13).find(".box").hide();
				}else if(iop>126 && iop<=144){
					$("li").find(".box").show();
					$("li").eq(4).find(".box").hide();
					$("li").eq(5).find(".box").hide();
					$("li").eq(6).find(".box").hide();
					$("li").eq(7).find(".box").hide();
					$("li").eq(8).find(".box").hide();
					$("li").eq(9).find(".box").hide();
					$("li").eq(10).find(".box").hide();
					$("li").eq(11).find(".box").hide();
					$("li").eq(12).find(".box").hide();
				}else if(iop>144 && iop<=162){
					$("li").find(".box").show();
					$("li").eq(3).find(".box").hide();
					$("li").eq(4).find(".box").hide();
					$("li").eq(5).find(".box").hide();
					$("li").eq(6).find(".box").hide();
					$("li").eq(7).find(".box").hide();
					$("li").eq(8).find(".box").hide();
					$("li").eq(9).find(".box").hide();
					$("li").eq(10).find(".box").hide();
					$("li").eq(11).find(".box").hide();
				}else if(iop>162 && iop<=180){
					$("li").find(".box").show();
					$("li").eq(2).find(".box").hide();
					$("li").eq(3).find(".box").hide();
					$("li").eq(4).find(".box").hide();
					$("li").eq(5).find(".box").hide();
					$("li").eq(6).find(".box").hide();
					$("li").eq(7).find(".box").hide();
					$("li").eq(8).find(".box").hide();
					$("li").eq(9).find(".box").hide();
					$("li").eq(10).find(".box").hide();
				}else if(iop>180 && iop<=198){
					$("li").find(".box").show();
					$("li").eq(1).find(".box").hide();
					$("li").eq(2).find(".box").hide();
					$("li").eq(3).find(".box").hide();
					$("li").eq(4).find(".box").hide();
					$("li").eq(5).find(".box").hide();
					$("li").eq(6).find(".box").hide();
					$("li").eq(7).find(".box").hide();
					$("li").eq(8).find(".box").hide();
					$("li").eq(9).find(".box").hide();
				}else if(iop>198 && iop<=216){
					$("li").find(".box").show();
					$("li").eq(0).find(".box").hide();
					$("li").eq(1).find(".box").hide();
					$("li").eq(2).find(".box").hide();
					$("li").eq(3).find(".box").hide();
					$("li").eq(4).find(".box").hide();
					$("li").eq(5).find(".box").hide();
					$("li").eq(6).find(".box").hide();
					$("li").eq(7).find(".box").hide();
					$("li").eq(8).find(".box").hide();
				}else if(iop>216 && iop<=234){
					$("li").find(".box").show();
					$("li").eq(19).find(".box").hide();
					$("li").eq(0).find(".box").hide();
					$("li").eq(1).find(".box").hide();
					$("li").eq(2).find(".box").hide();
					$("li").eq(3).find(".box").hide();
					$("li").eq(4).find(".box").hide();
					$("li").eq(5).find(".box").hide();
					$("li").eq(6).find(".box").hide();
					$("li").eq(7).find(".box").hide();
				}else if(iop>234 && iop<=252){
					$("li").find(".box").show();
					$("li").eq(18).find(".box").hide();
					$("li").eq(19).find(".box").hide();
					$("li").eq(0).find(".box").hide();
					$("li").eq(1).find(".box").hide();
					$("li").eq(2).find(".box").hide();
					$("li").eq(3).find(".box").hide();
					$("li").eq(4).find(".box").hide();
					$("li").eq(5).find(".box").hide();
					$("li").eq(6).find(".box").hide();
				}else if(iop>252 && iop<=270){
					$("li").find(".box").show();
					$("li").eq(17).find(".box").hide();
					$("li").eq(18).find(".box").hide();
					$("li").eq(19).find(".box").hide();
					$("li").eq(0).find(".box").hide();
					$("li").eq(1).find(".box").hide();
					$("li").eq(2).find(".box").hide();
					$("li").eq(3).find(".box").hide();
					$("li").eq(4).find(".box").hide();
					$("li").eq(5).find(".box").hide();
				}else if(iop>270 && iop<=288){
					$("li").find(".box").show();
					$("li").eq(16).find(".box").hide();
					$("li").eq(17).find(".box").hide();
					$("li").eq(18).find(".box").hide();
					$("li").eq(19).find(".box").hide();
					$("li").eq(0).find(".box").hide();
					$("li").eq(1).find(".box").hide();
					$("li").eq(2).find(".box").hide();
					$("li").eq(3).find(".box").hide();
					$("li").eq(4).find(".box").hide();
				}else if(iop>288 && iop<=306){
					$("li").find(".box").show();
					$("li").eq(15).find(".box").hide();
					$("li").eq(16).find(".box").hide();
					$("li").eq(17).find(".box").hide();
					$("li").eq(18).find(".box").hide();
					$("li").eq(19).find(".box").hide();
					$("li").eq(0).find(".box").hide();
					$("li").eq(1).find(".box").hide();
					$("li").eq(2).find(".box").hide();
					$("li").eq(3).find(".box").hide();
				}else if(iop>306 && iop<=324){
					$("li").find(".box").show();
					$("li").eq(14).find(".box").hide();
					$("li").eq(15).find(".box").hide();
					$("li").eq(16).find(".box").hide();
					$("li").eq(17).find(".box").hide();
					$("li").eq(18).find(".box").hide();
					$("li").eq(19).find(".box").hide();
					$("li").eq(0).find(".box").hide();
					$("li").eq(1).find(".box").hide();
					$("li").eq(2).find(".box").hide();
				}else if(iop>324 && iop<=342){
					$("li").find(".box").show();
					$("li").eq(13).find(".box").hide();
					$("li").eq(14).find(".box").hide();
					$("li").eq(15).find(".box").hide();
					$("li").eq(16).find(".box").hide();
					$("li").eq(17).find(".box").hide();
					$("li").eq(18).find(".box").hide();
					$("li").eq(19).find(".box").hide();
					$("li").eq(0).find(".box").hide();
					$("li").eq(1).find(".box").hide();
				}else if(iop>342 && iop<=360){
					$("li").find(".box").show();
					$("li").eq(12).find(".box").hide();
					$("li").eq(13).find(".box").hide();
					$("li").eq(14).find(".box").hide();
					$("li").eq(15).find(".box").hide();
					$("li").eq(16).find(".box").hide();
					$("li").eq(17).find(".box").hide();
					$("li").eq(18).find(".box").hide();
					$("li").eq(19).find(".box").hide();
					$("li").eq(0).find(".box").hide();
				}else{
					$("li").find(".box").show();
				}
			}
			
			
			r+=0.5;
			for(var i=0;i<$("li").length;i++){
				$("li").eq(i).css({"-webkit-transform":"rotateY("+parseFloat(parseFloat(i*18)+parseFloat(r))+"deg)","transform":"rotateY("+parseFloat(parseFloat(i*18)+parseFloat(r))+"deg)","-moz-transform":"rotateY("+parseFloat(parseFloat(i*18)+parseFloat(r))+"deg)","-ms-transform":"rotateY("+parseFloat(parseFloat(i*18)+parseFloat(r))+"deg)"});
				$("li").eq(i).find(".box").css({"background-position":-i*51+"px 0"});
				
			}
		},30)
	})
</script>
<script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
<script>
    wx.config({
        debug: false,
        appId: '<?php echo $signPackage["appId"];?>',
        timestamp: '<?php echo $signPackage["timestamp"];?>',
        nonceStr: '<?php echo $signPackage["nonceStr"];?>',
        signature: '<?php echo $signPackage["signature"];?>',
        jsApiList: [
            // 所有要调用的 API 都要加到这个列表中
            'checkJsApi',
            'onMenuShareTimeline',
            'onMenuShareAppMessage',
            'onMenuShareQQ',
            'onMenuShareWeibo'
        ]
    });
    window.shareData = {
        "imgUrl": "http://gmlib.jikehd.com/jkhd/suchen/rotate/img/logo.png",          //微信分享网址
        "tLink": "http://gmlib.jikehd.com/jkhd/suchen/rotate/index.php",                 //微信分享logo图
        "tTitle": '苏尘',                        // 微信分享标题
        "tContent": "我自横刀向天笑，笑完以后去睡觉！！！"    //微信分享内容
    };
    wx.ready(function () {
        // 在这里调用 API
        wx.checkJsApi({
            jsApiList: [
                'onMenuShareTimeline',
                'onMenuShareAppMessage',
            ]
        });
        wx.onMenuShareAppMessage({
            title: window.shareData.tTitle,
            desc: window.shareData.tContent,
            link: window.shareData.tLink,
            imgUrl: window.shareData.imgUrl,
            success: function (res) {
                //alert('已分享');
            },
            cancel: function (res) {
                //alert('已取消');
            }
        });

        wx.onMenuShareTimeline({
            title: window.shareData.tTitle,
            link: window.shareData.tLink,
            imgUrl: window.shareData.imgUrl,
            success: function (res) {
                //alert('已分享');
            },
            cancel: function (res) {
                //alert('已取消');
            }
        });
    });
</script>